<!--
 * @Author: egg1bro
 * @Date: 2023-01-07 21:48:27
 * @LastEditTime: 2023-01-08 11:35:23
 * @LastEditors: egg1bro
 * @Description: 
 * @FilePath: \team-graduation-design\src\views\Register\addName.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>
    <!-- 导航栏 -->
    <div class="nav">
        <van-nav-bar left-arrow @click-left="onClickLeft" />
    </div>

    <!-- 输入框 -->
    <div class="ipt">
        <van-cell-group inset>
            <van-field class="my-field" v-model="value1" placeholder="请输入您的真实姓名" clearable />
        </van-cell-group>
    </div>

    <!-- 登录按钮 -->
    <div class="lgbtn">
        <van-button square block type="primary" native-type="submit" @click="goMe">
            登录
        </van-button>
    </div>
</template>

<script setup>
import { ref } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { useRegisterStore } from '@/stores/register'
// 实例化路由
const router = useRouter()
const route = useRoute()
// 实例化仓库
const registerStore = useRegisterStore()

const { getAddUserName } = registerStore
const value1 = ref('')



const onClickLeft = () => {
    router.push('/register')
}

const goMe = async () => {
    try {
        await getAddUserName({ user_phone: route.query.user_phone, user_name: value1.value })
    } catch (error) {
        return Promise.reject(error)
    }
}
</script>

<style lang="less" scoped>
.nav {
    --van-nav-bar-arrow-size: 20px;
    --van-nav-bar-icon-color: black;

    margin-bottom: 10px;

    .van-hairline--bottom:after {
        border-bottom-width: 0;
    }
}

.ipt {
    :deep(.van-field__control) {
        padding-bottom: 5px;
        border-bottom: 1px solid #d6d6d6;

    }
}

.lgbtn {
    margin: 20px 30px 10px 30px;
}
</style>